<template>
  <div class="center">
    <div class="header">培训结束</div>
    <div class="content">
      <div style="height: 50px; font-size: 40px">
        播放倒计时:{{ countdown }}秒
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { computed, ref, watch, onMounted, nextTick } from "vue";
const initialCountdown = 3; // 初始倒计时为120秒
const countdown = ref(initialCountdown); // 设置倒计时状态
// 启动倒计时
const startCountdown = () => {
  interval = setInterval(() => {
    if (countdown.value > 0) {
      countdown.value--;
    } else {
      clearInterval(interval); // 倒计时结束，清除定时器
      //获取待播放课件
      getPlayCoursewareApi({ jobTypeName: "起重工" }).then((res) => {
        if (res.code === 2000) {
          //开始播放
          playState.value = true;
          //获取到待播放课件
          planInfo.value = res.data;
          //设置播放的课件,默认播放第一个
          courseUrl.value = planInfo.value.planCourses[0].course.courseUrl;
        }
      });
    }
  }, 1000);
};
</script>

<style scoped lang="scss">
.center {
  width: 100%;
  height: 100%;
  background-color: #2a2a3b;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.header {
  font-size: 40px;
  color: #fff;
}
</style>
